<!-- 课程目录 -->
<template>
    <div v-loading="loading" class="course-tree">
        <tree-index
            v-if="treeData && treeData.length"
            :data="treeData"
            :is-buy-person="isBuyPerson"
            :is-creater="isCreater"
            page-type="catalogueDetail"
            @node-click="checkClick"
            defaultExpandAll
            :activeId="activeId"
            :is-preview="isPreview"
            :courseWare-state-info-list="courseWareStateList"
        >
        </tree-index>
         <div class="no-data" v-else>
			<NoData info="暂无课程目录" url="no-data@2x.png" />
		</div>
    </div>
</template>

<script setup>
import { ref, onMounted } from 'vue';
import { useRoute } from 'vue-router'
import TreeIndex from '@/components/catalogue/tree-mini.vue'
import NoData from '@/components/no-data.vue';
import { queryToJson } from '@/lib/tools';

const emit = defineEmits(['change-catalogue']);

const route = useRoute();

const props = defineProps({
    currentTab: {
        type: String,
        default: ''
    },
    detail: {
        type: Object,
        default: () => {
            return {};
        }
    },
    isCreater: { // 是否是创建者
        type: Boolean,
        default: false
    },
    isBuyPerson: { // 是否是购买者
        type: Boolean,
        default: false
    },
    isPreview: { // 是否是预览状态
        type: Boolean,
        default: false
    },
    courseWareStateList: { 
        type: Array,
        default: () => {
            return []
        }
    }
})

const treeData = ref([]);

const loading = ref(false);

async function getCategory(node) {
    if (!route.params?.moocId || !route.query?.courseId) {
        return;
    }
    try {
        loading.value = true;
        let res = await G_transmit('moocCatalogue', {
            data: {
                courseId: route.query.courseId, // 课程id
                pid: node?.data?.catalogueId || 0, // 父级ID
                moocId: route.params.moocId // 目录层深 默认4
            }
       })
       loading.value = false;
       treeData.value = res.data || [];
   } catch (_err) {
       loading.value = false;
       console.log(_err);
   }
}

const activeId = ref(queryToJson().catalogueId);

// 跳转
function checkClick(data) {
    if (data.catalogueType === 1) { // 目录类型{0.文件目录1课件}
        emit('change-catalogue', data.catalogueId, data.courseWare);
        activeId.value = data.catalogueId;
    }
}

onMounted(() => {
    activeId.value = queryToJson().catalogueId;
    if(route.query.courseId) {
        getCategory();
    }
})


</script>

<style lang="scss" scoped>
.course-tree {
    padding: 0px 20px;
}

</style>
